import React, { useEffect, useState, useRef } from 'react';

export default function Test5() {
    let [x, setX] = useState(0);
    let selfRef = useRef(true);
    let domRef = useRef();

    // 利用useRef,偶数次执行
    useEffect(()=>{
        if(!selfRef.current){
            console.log('执行了');
        }
        selfRef.current = !selfRef.current
    }, [x]);

    // 利用useRef存储dom对象
    useEffect(()=>{
        console.log('dom--', domRef.current);
    }, [x]);


    return <div>
        <div className='demo_box' ref={domRef}>
            <p>x值为: {x}</p>
            <p>
                <button onClick={()=> setX( x+1 )}>x+1</button>
                <button onClick={()=> setX( x-1 )}>x-1</button>
            </p>
        </div>
    </div>
};


// react-router-dom6.0  路由跳转及传参 https://www.cnblogs.com/Regina-wisdom/p/15479240.html
